<!DOCTYPE html>
<html>
<head>
  <title>手机验证码登录</title>
  <meta charset="utf-8">
</head>
<body>
<form>
  <label for="telephone">手机号码：</label>
  <input type="text" id="telephone" name="telephone" required>
  <button type="button" onclick="sendCode()">获取验证码</button><br><br>

  <label for="code">验证码：</label>
  <input type="text" id="code" name="code" required><br><br>

  <button type="button" onclick="login()">登录</button>
</form>

<script>
  function sendCode() {
    var telephone = document.getElementById("telephone").value;

    if (telephone === "") {
      alert("请输入手机号码！");
      return;
    }

    var xhr = new XMLHttpRequest();

    xhr.onreadystatechange = function() {
      if (xhr.readyState === XMLHttpRequest.DONE) {
        if (xhr.status === 200) {
          var result = eval("(" + xhr.responseText + ")");
          if (result.status === "0") {
            alert(result.msg);
          } else {
            alert(result.msg);
          }
        } else {
          alert("发送验证码失败，请稍后再试！");
        }
      }
    };

    xhr.open("POST", "/platform/PcLoginController/sendSmsCode", true);
    xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xhr.send("telephone=" + telephone );
  }

  function login() {
    var telephone = document.getElementById("telephone").value;
    var code = document.getElementById("code").value;

    if (telephone === "" || code === "") {
      alert("请输入手机号码和验证码！");
      return;
    }

    var xhr = new XMLHttpRequest();

    xhr.onreadystatechange = function() {
      if (xhr.readyState === XMLHttpRequest.DONE) {
        if (xhr.status === 200) {
          var result = eval("(" + xhr.responseText + ")");
          alert(result.msg);
        } else {
          alert("登录失败，请稍后再试！");
        }
      }
    };

      xhr.open("POST", "/platform/PcLoginController/smsLogin", true);
    xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xhr.send("telephone=" + telephone + "&code=" + code);
  }
</script>
</body>
</html>
